<template>
<view class="">
		
     <!--  待支付-->
    <u-subsection :list="list" :current="curNow" @change="sectionChange"></u-subsection>
	<view class="" v-if="curNow==0">
		<!-- <view class="" v-for="(i,index) in arr" :key="index"> -->
	<!-- 	<view class="">
		 	{{arr}}
		 </view> -->
		<!-- <view class=""  v-for="(i,index) in arr" :key="index">
		 	 {{i.address}}
		 </view> -->
		 <view class=""v-for="(j,index) in arr" :key="index">
		<uni-section title="" type="line" >
					<uni-card title="订单情况"   :extra= "'商品编号：'+j.number" >
						<view v-for="(i,index) in j.commodityimg" :key="index" style="width: 130rpx;height: 130rpx; float: left; ">
								<image :src="i.pash" style="width: 125rpx;height: 125rpx; float: left;" mode=""></image>
						</view>
						<!-- <view style="width: 130rpx;height: 130rpx; float: left; " >
							<image :src="i.storeLogo" style="width: 125rpx;height: 125rpx; float: left;" mode=""></image>
						</view> -->
						<view class="" style="float: left;   width: 360rpx; margin-left: 30px;">
							<text style="float: left; width: 400rpx;" >{{j.commodity.commodityName}}</text>
						<!-- 	<text style="float: left; width: 400rpx;">{{j.creationTime}}</text> -->
							<text style="float: left; width: 400rpx;">{{j.total}}币</text>
						</view>
					
					<view class="" style="float: right;">
				
						<u-button type="primary" style="width: 130rpx; height: 60rpx; float: left; margin-left: 20rpx;" shape="circle" text="取消订单" @click="show = true"></u-button>
			<!-- 			<u-button type="primary" style="width: 130rpx; height: 60rpx; float: left; margin-left: 20rpx;" shape="circle" text="立即支付" @click="zhifi(j)"></u-button>
						<u-button type="primary" style="width: 130rpx; height: 60rpx; float: left; margin-left: 20rpx;" shape="circle" text="立即支付" @click="ss()"></u-button> -->
						<u-popup :show="show" mode="center"  @close="close" @open="open" round="5px" customStyle="width: 241px; height: 120px;">
						        <view style="margin-top: 10rpx; margin-left: 30rpx;">
									<text><h3 style="margin-top: 20rpx; margin-bottom: 10rpx;">订单取消</h3></text>
						            <text style="margin-left: 70rpx;"> 请确认是否取消订单</text>
									<view class="" style="margin-top: 15rpx;">
									
										<u-button type="info" :plain="true" :hairline="false" style="width: 140rpx; height: 70rpx;  float: left; margin-left: 20rpx;" text="立即取消" @click="ljqx(j.coId)"></u-button>
										<u-button  type="error" :plain="true" style="width: 140rpx; height: 70rpx;  float: left ; margin-left: 60rpx;"  text="暂不取消" @click="show = false"></u-button>
										
									</view>
						        </view>
							</u-popup>
					</view>
					</uni-card>
				</uni-section>
		<!-- 	 <image src=../../static/wode.png mode=""></image> -->
		 </view>
	</view>
	<!-- 已接单 -->
	<view class="" v-if="curNow==1">
	<view class=""v-for="(j,index) in arr" :key="index">
	<uni-section title="" type="line" >
				<uni-card title="订单情况"   :extra= "'商品编号：'+j.number" >
					<view v-for="(i,index) in j.commodityimg" :key="index" style="width: 130rpx;height: 130rpx; float: left; ">
							<image :src="i.pash" style="width: 125rpx;height: 125rpx; float: left;" mode=""></image>
					</view>
					<!-- <view style="width: 130rpx;height: 130rpx; float: left; " >
						<image :src="i.storeLogo" style="width: 125rpx;height: 125rpx; float: left;" mode=""></image>
					</view> -->
					<view class="" style="float: left;   width: 360rpx; margin-left: 30px;">
						<text style="float: left; width: 400rpx;" >{{j.commodity.commodityName}}</text>
					<!-- 	<text style="float: left; width: 400rpx;">{{j.creationTime}}</text> -->
						<text style="float: left; width: 400rpx;">{{j.total}}币</text>
						<text style="float: left; width: 400rpx;">取货门店：{{j.store.storeName}}</text>
						<text style="float: left; width: 400rpx; margin-left: 26rpx;">取货码：{{j.tan}}</text>
					</view>
				
				<view class="" style="float: right;">
					<u-button type="primary" style="width: 130rpx; height: 60rpx; float: left; margin-left: 20rpx;" shape="circle" text="二维码" @click="show1 = true"></u-button>
						<u-button type="primary" style="width: 130rpx; height: 60rpx; float: left; margin-left: 20rpx;" shape="circle" text="订单详情" @click="ddxq(j.coId)"></u-button>
					<u-popup :show="show1" mode="center"  @close="close" @open="open" round="5px" customStyle="width: 160px; height: 160px;">
						
					        <view style="margin-top: 10rpx; margin-left: 30rpx;">
								 <image :src="j.qrcodeimg" mode="" style="width: 200rpx; height: 200rpx; margin-left: 20rpx;"></image>
							<view class="" style="margin-top: 15rpx;">
								<u-button  type="error" :plain="true" style="width: 140rpx; height: 70rpx;  float: left ; margin-left: 60rpx;"  text="返回" @click="show1 = false"></u-button>
							</view>
					        </view>
						</u-popup>
				</view>
				</uni-card>
			</uni-section>
	<!-- 	 <image src=../../static/wode.png mode=""></image> -->
	 </view>
		
	</view>
	<!-- 配送中 -->
	<view class="" v-if="curNow==2">
	<view class=""v-for="(j,index) in arr" :key="index">
	<uni-section title="" type="line" >
				<uni-card title="订单情况"   :extra= "'商品编号：'+j.number" >
					<view v-for="(i,index) in j.commodityimg" :key="index" style="width: 130rpx;height: 130rpx; float: left; ">
							<image :src="i.pash" style="width: 125rpx;height: 125rpx; float: left;" mode=""></image>
					</view>
					<!-- <view style="width: 130rpx;height: 130rpx; float: left; " >
						<image :src="i.storeLogo" style="width: 125rpx;height: 125rpx; float: left;" mode=""></image>
					</view> -->
					<view class="" style="float: left;   width: 360rpx; margin-left: 30px;">
						<text style="float: left; width: 400rpx;" >{{j.commodity.commodityName}}</text>
					<!-- 	<text style="float: left; width: 400rpx;">{{j.creationTime}}</text> -->
						<text style="float: left; width: 400rpx;">{{j.total}}币</text>
					</view>
				
				<view class="" style="float: right;">
				<!-- 	<u-button type="primary" style="width: 130rpx; height: 60rpx; float: left; margin-left: 20rpx;" shape="circle" text="订单详情" @click="show = true"></u-button> -->
					<!-- <u-button type="primary" style="width: 130rpx; height: 60rpx; float: left; margin-left: 20rpx;" shape="circle" text="二维码" @click="show = true"></u-button> -->
					<u-popup :show="show" mode="center"  @close="close" @open="open" round="5px" customStyle="width: 241px; height: 160px;">
					        <view style="margin-top: 10rpx; margin-left: 30rpx;">
								<text><h3 style="margin-top: 20rpx; margin-bottom: 10rpx;">订单取消</h3></text>
					            <text> 门店人员可能正忙，请确认是否
								取消订单或等待时间结束后自动
								取消订单。</text>
								<view class="" style="margin-top: 15rpx;">
								
									<u-button type="info" :plain="true" :hairline="false" style="width: 140rpx; height: 70rpx;  float: left; margin-left: 20rpx;" text="立即取消" @click="ljqx(j.roId)"></u-button>
									<u-button  type="error" :plain="true" style="width: 140rpx; height: 70rpx;  float: left ; margin-left: 60rpx;"  text="暂不取消" @click="show = false"></u-button>
									
								</view>
					        </view>
						</u-popup>
				</view>
				</uni-card>
			</uni-section>
	<!-- 	 <image src=../../static/wode.png mode=""></image> -->
	 </view>
	</view>
	<!-- 已完成 -->
	<view class="" v-if="curNow==3">
		<view class=""v-for="(j,index) in arr" :key="index">
		<uni-section title="" type="line" >
					<uni-card title="订单情况"   :extra= "'商品编号：'+j.number" >
						<view v-for="(i,index) in j.commodityimg" :key="index" style="width: 130rpx;height: 130rpx; float: left; ">
								<image :src="i.pash" style="width: 125rpx;height: 125rpx; float: left;" mode=""></image>
						</view>
						<!-- <view style="width: 130rpx;height: 130rpx; float: left; " >
							<image :src="i.storeLogo" style="width: 125rpx;height: 125rpx; float: left;" mode=""></image>
						</view> -->
						<view class="" style="float: left;   width: 360rpx; margin-left: 30px;">
							<text style="float: left; width: 400rpx;" >{{j.commodity.commodityName}}</text>
						<!-- 	<text style="float: left; width: 400rpx;">{{j.creationTime}}</text> -->
							<text style="float: left; width: 400rpx;">{{j.total}}币</text>
						</view>
					
					<view class="" style="float: right;">
						<u-button type="primary" style="width: 130rpx; height: 60rpx; float: left; margin-left: 20rpx;" shape="circle" text="订单详情" @click="ddxq(j.coId) "></u-button>
					</view>
					</uni-card>
				</uni-section>
		<!-- 	 <image src=../../static/wode.png mode=""></image> -->
		 </view>
	</view>
</view>
</template>

<script>
		import request from '../../request.js'
	export default {
		data() {
			return {
				show: false,
				show1:false,
                list: ['待支付', '待取货', '配送中','已完成'],
				curNow: 0,
				arr:[],
				storeId:'',
				riderId:'',
				arr2:[],
				arr3:[],
				coId:'',
				userId:'',
				union:{
					commodity:{},
					sum:1,
					price:0,
					sptype:'',
					sptypeid:0,
				},
			}
		},
		onLoad(w) {
			console.log(w.curNow)
			this.curNow=w.curNow
			this.load(this.curNow)
		},
		methods: {
			zhifi(j){
				console.log(j)
				this.union.commodity=j.commodity
				this.union.sum=j.quantity
				this.union.sptype='球员版'
				this.union.sptypeid=1
				uni.navigateTo({
					url:'../shangcheng/djjs?union='+encodeURIComponent(JSON.stringify(this.union)),

				})
			},
			txjd(){
				uni.showToast({
				                    title: '已向门店发送接单提醒',
				                    icon: 'none'
				                });
			},
			//拨打电话
			hphone(x){
				uni.makePhoneCall({
					phoneNumber:x,
					success:(res)=> {
						console.log('调用成功')
					},
					fail:(res)=> {
						console.log(res);
					}
				});
				    plus.device.dial(phoneNumber,true)
			},

			ljqx(j){
			    
				this.show=false
				this.show1=false
				this.coId=j
				console.log(this.coId)
				uni.showToast({
					title:'取消成功'
				});
				request({
					url:"xkuser/commodityorder/qxdd/"+this.coId,
					method:'get',
					success:(res)=>{
						this.load()
					}
				});
			},
			//加载
			load(){
				uni.getStorage({
									key: 'userid',
									success: res => {
										this.userid = res.data
										console.log("zaizhe", this.userid)
										this.userId=this.userid	
											console.log(this.userId)
									}
								});
				request({
					url:"xkuser/commodityorder/load/"+this.curNow+ '/'+this.userId,
					method:'get',
					success:(res)=>{
					
						this.arr = res.data.data.arr
						// for(var a = 0; i<this.arr.length;i++){
						// 		this.arr[a].creationTime.replace('/T/g', ' ').replace(/.[\d]{3}Z/, ' ')
						// 		console.log(this.arr[a].creationTime)
						// }
						// console.log(this.arr[a].creationTime)
						
				        console.log(this.arr)
						console.log(this.arr.commodityimg)	
						for(var i = 0 ; i<this.arr.length;i++ ){
							this.storeId = this.arr[i].storeId
							this.riderId = this.arr[i].riderId
						}
						// console.log(this.storeId)
						// this.load2(this.storeId)
						// if(this.curNow == 1||this.curNow==2){
						// this.load3(this.riderId)
						// }
					}
				})
			},
			load2(){
				console.log(this.storeId)
				request({
					url:"xkuser/store/load2/"+this.storeId,
					method:'get',
					success:(res)=>{
						this.arr2=res.data.data.arr2
						// console.log(this.arr2)
					}
				})
				// uni.request({
				// 					url:'xkuser/store/load2',
				// 					method: 'GET',
				// 				   data: {
				// 					   storeId:this.storeId,
				// 				   },
				// 				   dataType:'json',
				// 				   success: (res) => {
				// 						// var result = JSON.parse(res.data.data.message);
				// 						var result = res.data.message;
				// 						console.log(res.data)
					
				// 					},
				// 				})
			},
			load3(){
				request({
					url:"xkuser/user/load3/"+this.riderId,
					method:'get',
					success:(res)=>{
						this.arr3=res.data.data.arr3
						console.log(this.arr3)
					}
				})
			},
			// 查看订单页面
			ddxq(j){
				this.coId = j
				uni.navigateTo({
					url:"./commodityorderlist?coId="+this.coId,
				})
			},
			sectionChange(index) {
				this.curNow = index;
				console.log(this.curNow);
				this.load(this.curNow)
			}
		}
	}
</script>